import util from '../../utils/util';

Page({

  data: {
    isFormat:false,
    format:{},

    // 存储编辑的内容以及样式html代码片段
    html:'',

    // 判断是否已经编辑
    isContent:false

  },



  // 获取活动编辑内容  并将编辑内容写入数据库中
  getEditorContent(e){
    // console.log('获取编辑内容',e);
    const that = this;
    this.setData({
      isContent:true,
      html:e.detail.html
    })


  },

  // 编辑器初始化时完成触发
  onEditorReady(){
    const that = this;
    wx.createSelectorQuery().select('#editor')
    .context(function(res){
      console.log('编辑器初始化完成触发',res)
      that.editorCtx = res.context
      // 如果存储中有编辑内容 则展示出来
      const content = wx.getStorageSync('contentHtml')
      if(content){
        that.setData({
          html:content
        })
        that.editorCtx.setContents({
          html:content,
          success:re=>{
            console.log('展示成功',re)
          }
        })
      }
    }).exec()
  },


  // 撤销操作
  unDo(){
    this.editorCtx.undo()
  },

  // 恢复操作
  reDo(){
    this.editorCtx.redo()
  },

  // 失去焦点 收起键盘  进行页面跳转
  blur(){

    // 将数据保存到本地
    wx.setStorageSync('contentHtml', this.data.html);
    this.editorCtx.blur();
    wx.switchTab({
      url: '/pages/publish/publish',
    });

  },

  // 插入分割线
  insertDivider(){
    this.editorCtx.insertDivider()
  },

  // 改变样式
  format(){
    let format = this.data.format;
    console.log('===================',format)
    if(format.text){
      format.text = false;
      this.setData({
        isFormat:false,
        format
      })
      return;
    }
    format.text = true;
    this.setData({
      isFormat:true,
      format
    })
  },

  // 标题 居中 居右 加粗 斜体 下划线
  format_style(e){
    const target = e.target.id;

    console.log('编辑样式id = ',target)

    let format = this.data.format;
    if(target==='center'&&format.right){
      // 如果点击的是居中，那么居右的则改变状态为false
      format.right = false;
    }
    if(target === 'right' && format.center){
      format.center = false
    }

    if(format[target]){
      console.log('===========',format[target])
      format[target] = false;
      this.setData({
        format
      });

      this.add_style(format)
      return;
    }

    format[target] = true;
    this.add_style(format);
    this.setData({
      format
    })
  },

  // 增加样式
  add_style(format){
    // 增加样式之前先清除全部样式
    // 清除样式以及复原样式
    this.editorCtx.format('align','left')
    this.editorCtx.removeFormat();
    // 根据format为true的进行样式增加
    Object.keys(format).forEach(key=>{
      if(format[key] && key!=='text'){
        console.log('======key值======',key)
        switch(key){
          case 'header':
            // this.editorCtx.format('header','H2')
            // 用字体变大 颜色变粗来进行替换
            this.editorCtx.format('fontSize','24px');
            this.editorCtx.format('fontWeight','bold')
            break;
          case 'center':
            this.editorCtx.format('align','center');
            break;
          case 'right':
            this.editorCtx.format('align','right');
            break;
          default:
            this.editorCtx.format(`${key}`)
        }
      }
    })
  },

  // 上传图片
  bindImg(){
    const that = this;
    // 选择图片
    wx.chooseMedia({
      count:1,
      mediaType: ['image'],
      sourceType: ['album', 'camera'],
      camera: 'back',
      success(res) {
        // console.log("获取图片",res);
        const src = res.tempFiles[0].tempFilePath;
        // 将图片上传到云存储
        wx.cloud.uploadFile({
          cloudPath:`${util.wxuuid()}.png`,
          filePath:src,
          success:(result)=>{
            // 返回文件ID
            // console.log(result.fileID);
            // 当成功返回文件ID时 插入富文本编辑器中
            that.editorCtx.insertImage({
              src:result.fileID,
              width:'50%',
              extClass:'editorImg'
            })
          }
        })

      }
    })

      
  },


})